<template>
	<view class="content">
<div></div>
		<view class="topHead">
			<view class="stateDoc">
				<u-button type="success" text="联系医生" v-if="state == 1" shape="circle" 
				custom-style="width: 80%; height: 80%;" @tap="tapState"></u-button>
				<u-button type="warning" text="智能科普" v-else shape="circle" 
				custom-style="width: 80%; height: 80%;" @tap="tapState"></u-button>
			</view>
			<view class="jumpBut" @tap="jumpPatient">
				<text v-if="flag">凡</text><!-- 使用名字最后一个字 -->
				<text v-else>无</text>
				<image :src="getInfoImg"></image>
			</view>
		</view>
		<view class="chat" style="width: 100%;">
			<ai-chat :obj="obj" :hei="hei" />
		</view>
		<view class="inpSay" style="width: 100%;">
			<inp-say @pushObj="pushObj" :obj="obj" />
		</view>
	</view>
</template>

<script>
	const recorderManager = uni.getRecorderManager();
	const innerAudioContext = uni.createInnerAudioContext();
	innerAudioContext.autoplay = true;
	import aiChat from '../../components/aiChat/aiChat.vue';
	import inpSay from '../../components/inpSay/inpSay.vue'
	import store from '../../store/index.js'

	export default {
  	components: { aiChat, inpSay },
		data () {
			return {
				obj: [], //聊天框数据
				diseaseList: [], //病症名字列表
				flag: uni.getStorageSync('openid'),
				state: 1, //当前聊天模式 1是机器回复 2是医生回复
				storeInfo: store.state.info,
				hei: 0
			}
		},
		onLoad(e) {
			const seft = this
			recorderManager.onStop(function (res) {
				seft.recordstate = 0
			})
			if(!e.type || e.type == {}) {
				seft.obj.push(
					new this.getText(1, 0, '你有什么不舒服的地方')
				)
			} else {
				seft.obj.push(
					new this.getText(1, 0, '您怎么称呼，我们希望您告知我们您的真实姓名')
				)
			}
			store.dispatch('getInfo')
		},
		onShow () {
			this.flag = uni.getStorageSync('openid')
			this.$http.get(`/art/sympIndex`).then(res => {
				this.diseaseList = res.data
			})
		},
		mounted () {
			let data1 = uni.getSystemInfoSync().windowHeight
			const query = uni.createSelectorQuery().in(this);
			
			query.select('.topHead').boundingClientRect(data => {
				data1 -= data.height
				this.hei = data1 * .87
			}).exec();
		},
		watch: {
			storeInfo(newVal, oldVal) {
				this.obj.push(
					new this.getText(1, 0, newVal[newVal.length - 1].text)
				)
			}
		},
		methods: {
			tapState: function () {
				if(this.state == 1 && this.flag) {
					this.state = 2
				} else if(this.state == 1 && !this.flag) {
					uni.showToast({
						title: '请先登录',
						icon: 'error',
						duration: 2000
					});
				} else {
					this.state = 1
				}
			},
			changeScr: function (data, elmHei2) { //移动视窗
				++this.n2
				uni.pageScrollTo({
					scrollTop: (this.elmHei==0 ? (data.height - this.elmHei2 + 150) : data.height - this.elmHei + this.sumHei),
					duration: 300
				});
				this.sumHei += (this.elmHei==0 ? data.height - this.elmHei2 : data.height - this.elmHei)
				this.elmHei = data.height 
			},
			pushObj: function (ob) { //将数据放入页面
				this.obj.push(ob)
				let splitArr = ob.text.trim().split(' ')
				let list = this.diseaseList
				
				if(this.state == 1) {
					for(let i = 0; splitArr.length > i; i++) {
						if(list.arrLittle.indexOf(splitArr[i]) != -1) {
							let index = list.arrLittle.indexOf(splitArr[i])
							let intro = list.arrBig[index].intro
							this.obj.push(
								new this.getText(3, 2, '', [new this.getTextList(list.arrBig[index].serialId, 0, list.arrLittle[index], intro)])
							)
							return
						}
					}
					this.obj.push(
						new this.getText(1, 0, ('小医不知道您的意思哦~ 请输入类似以下这种情况吧：' + this.diseaseList.arrLittle.slice(0, 10).join(',')))
					)
				} else {
					store.commit('send', {
						ids: this.flag,
						text: ob.text,
						state: 1
					})
				}
			},
			jumpPatient: function () { //点击切换用户后 判断是否有openid
				if(uni.getStorageSync('openid')) {
					uni.navigateTo({
						url: '/subpage/OfPatient/OfPatient'
					});
				} else {
					uni.showToast({
						title: '请先登录',
						icon: 'error',
						duration: 2000
					});
				}
			},
			//构造函数区
			getText: function (id, state, text, knowlist = []) { //对话构造函数
				this.id = id
				this.state = state
				this.text = text
				this.knowlist = knowlist
			},
			getTextList: function (kid, knowledgeState, title, article) { //知识列表对话框构造函数
				this.kid = kid
				this.knowledgeState = knowledgeState
				this.title = title
				this.article = article
			}
		},
		computed: {
			getInfoImg () {
				return this.$url + '/state/whileright.png'
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		position: relative;
		
		/*  #ifdef MP-WEIXIN */
			.chat {
				position: relative;
				top: 20px;
			}
		/*  #endif  */

	}

	.topHead {
		position: fixed;
		top: 0;
		z-index: 999;
		height: 90rpx;
		width: 100%;
		box-shadow: 0px -15px 10px 10px rgba(0, 0, 0, .3);
		background-color: #fff;
		.stateDoc {
			display: flex;
			align-items: center;
			position: absolute;
			left: 14rpx;
			top: 50%;
			transform: translateY(-50%);
			width: 164rpx;
			height: 80rpx;
		}
		.jumpBut {
			display: flex;
			position: absolute;
			right: 20rpx;
			top: 50%;
			transform: translateY(-50%);
			justify-content: flex-end;
			align-items: center;
			width: 110rpx;
			height: 65rpx;
			background-color: #8B8FFF;
			color: #fff;
			border-radius: 40rpx;
			line-height: 80rpx;
			padding-right: 5rpx;
			box-sizing: border-box;
		}
		image {
			height: 40rpx;
			width: 40rpx;
		}
	}
	
	
</style>
